<template>
	<view>
<!-- 		<view class="card">
			<view>{{data.couponTitle}}</view>
			<view>满{{data.useMinPrice}} 减{{data.couponPrice}}</view>
			<view>领卷时间:{{data.createTime}}</view>
		</view> -->
		
		<view v-if="!power" class="tips">
			无权访问此页面
		</view>
		<template v-else>
			<view v-if="isdata">
				<view style="text-align: center;margin-top: 10%;">
					<image :src="user.avatar" class="userAvatar"></image>
				</view>
				<view style="text-align: center;">
					<text style="font-weight: bold; color: #282828;">{{user.nickname}}</text>
				</view>
			</view>
			
			<div class="coupon-list"  :class="[{disable:disable},{green:data.couponType==3}]"   v-if="isdata">
			  <div class="item acea-row row-center-wrapper" :class="[{green:data.couponType==3}]"  >
			    <div class="money" >
			      <div>
			        ￥<span class="num">{{ data.couponPrice }}</span>
			      </div>
			      <div class="pic-num">满{{ data.useMinPrice }}元可用</div>
			    </div>
			    <div class="text">
			      <div class="condition line1">
			        {{ data.couponTitle }}
			      </div>
			      <div class="data acea-row row-between-wrapper"  >
			        <div >领卷时间:{{data.createTime}}</div>
					 <div >有效时间:{{data.endTime}}</div>
					 <!-- <div>
						<div class="bnt bg-color-red" >点击核销</div>
					 </div> -->
			        
			      </div>
			    </div>
			  </div>
			</div>
			<view v-if="disable" class="tips">优惠券已使用或失效</view>
			<view   v-if="isdata" style="text-align: center;margin-top: 20px;">
				<button type="primary" size="mini" @click="off"  class="blueBtn"  style="margin-right: 5px;" v-if="!disable">点击核销</button>
				<button type="" size="mini" @click="clear"  >返回</button>
			</view>
			
			<view v-if="!isdata" class="cbody" style="margin-top: 40%;"><button type="primary" @click="saoma"  class="blueBtn">扫描优惠券</button></view>
			
			<view class="hisList" @click="toHistory">核销历史</view>
		</template>
		
	</view>
</template>

<script>
	import {qrCodeSign} from '@/config/setting';
	import {getCouponsUserOneTemp,getCouponsUserOneOffTemp} from '@/api/couponqr';
	import { mapState, mapGetters, mapMutations, mapActions } from 'vuex'
	
	export default {
		data() {
			return {
				tempId:"",
				data:{},
				user:{},
				isdata:false,
				disable:false,
				power:0,
				type:"",
			}
		},
		onLoad(e) {
			let type=e.type
			if(type){
				if(this.userInfo[type]==1){
					this.power=1;
					this.type=type;
				}
			}
			
		
		},
		 computed: mapGetters(['userInfo']),
		methods: {
			toHistory(){
				this.$yrouter.push({
							 path:'/pages/user/User/couponHistory',
								query: {
							  type:this.type
								},
				});
			},
			clear(){
				// let data=this.$options.data();
				// this.isdata=data.isdata
				// this.tempId=data.tempId
				// this.data=data.data
				// debugger
					
				//Object.assign(this.$data,this.$options.data())
				this.isdata=false;
				this.disable=false;
			},
			saoma(){
				var t=this
				uni.scanCode({
					success: function (res) {
						console.log('条码类型：' + res.scanType);
						console.log('条码内容：' + res.result);
						let str=res.result;
						try{
							let json=JSON.parse(str);
							if(json instanceof Object){
								if(json.type==qrCodeSign){
									let id=json.id
									t.tempId=id
									console.log(id,"扫码获得的id");
									getCouponsUserOneTemp(id).then(e=>{
										console.log(e.data,"数据");
										t.data=e.data.coupon
										t.user=e.data.user
										t.isdata=true
										t.beUsed(t.data)
									}).catch(e=>{
										t.nono(e.msg)
									})
								}else{
									t.nono()
								}
							}else{
								t.nono()
							}
						}catch(e){
							//TODO handle the exception
							t.nono()
						}
						
					}
				});
				
			},
			beUsed(data){
				let t=new Date(data.endTime).getTime();
				if(data.isFail==0&&data.status==0&&new Date().getTime()<t){
					this.disable=false
				}else{
					this.disable=true
				}
			},
			off(){
				var t=this;
					let id=this.tempId
				uni.showModal({
					title: '核销该优惠劵?',
					success: function (res) {
						if (res.confirm) {
							
							
							getCouponsUserOneOffTemp(id).then(e=>{
								if(e.data=="ok"){
									t.nono("核销成功");
									t.disable=true;
								}
							}).catch(e=>{
								t.nono(e.msg);
							})
							
							
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
				
			},
			nono(title="这不是停车券码"){
				uni.showToast({
					title,
					icon:"none"
				})
			}
		}
	}
</script>

<style scoped>
	.green{
		filter: hue-rotate(300deg)
	}
	.tips{
		font-size: 14px;
		color: gray;
		text-align: center;
	}
	.coupon-list{
		filter: hue-rotate(225deg);
	}
	.disable{
		filter: grayscale(1);
	}
	.hisList{
		position: fixed;bottom: 20px;
		width: 100%;left: 0;text-align: center;
		color: #277ec1;
		font-size: 14px;
	}
	.userAvatar{
		    width: 100px;
		    height: 100px;
		    border-radius: 50%;
		    border: 6px solid white;
		    box-shadow: 0 0 2px 0px #0000002e;
	}
	.blueBtn{
		background-color: #1890ff;
	}
	.cbody{
		padding: 20px;
	}
	.card{
		padding: 10px;
	}
</style>
